<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../lib/jquery-1.11.1.min.js"></script>
    <script>
        $(function () {
            $(window).on("keydown",function (e) {
//                console.log(e);
                if(e.keyCode==38)  //w
                {
                    $(".person").offset(
                        {
                            "top":  $(".person").offset().top -5
                        }
                    )
                }
                if(e.keyCode==37)  //a
                {
                    $(".person").offset(
                        {
                            "left" : $(".person").position().left-5
                        }
                    )

                }
                if(e.keyCode==39) {
                    $(".person").offset(
                        {
                            "left": $(".person").position().left + 5
                        }
                    )
                }

                if(e.keyCode==40)  //s
                {
                    $(".person").offset(
                        {
                            "top" :  $(".person").offset().top + 5
                        }
                    )

                }
            })
        })
    </script>
    <style>
        .person{
            width: 100px;
            height: 100px;
            background-color: #0099cc;
            position:absolute;
        }
    </style>
</head>
<body>

<div class="person"></div>

</body>
</html>